---
layout: default
---

<!-- Image to hack wechat -->
<!-- <img src="/img/icon_wechat.png" width="0" height="0"> -->
<!-- <img src="{{ site.baseurl }}/{% if page.header-img %}{{ page.header-img }}{% else %}{{ site.header-img }}{% endif %}" width="0" height="0"> -->

<!-- Post Header -->
<style type="text/css">
  header.intro-header {
    position: relative;
    background-image: url('{{ site.baseurl }}/{% if page.header-img %}{{ page.header-img }}{% else %}{{ site.header-img }}{% endif %}')
  }

  {
  %
  if
  page
  .
  header-mask
  %
  }
  header.intro-header .header-mask {
    width: 100%;
    height: 100%;
    position: absolute;

  background:
  rgba

  (
  0
  ,
  0
  ,
  0
  ,
  {
  {
    page . header-mask
  }
  }
  )
  ;
  }
  {
  %
  endif
  %
  }
</style>
<header class="intro-header">
  <div class="header-mask"></div>
  <div class="container">
    <div class="row">
      <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
        <div class="post-heading">
          <div class="tags">
            {% for tag in page.tags %}
            <a class="tag" href="{{ site.baseurl }}/tags/#{{ tag }}" title="{{ tag }}">{{ tag }}</a>
            {% endfor %}
          </div>
          <h1>{{ page.title }}</h1>
          {% if page.subtitle %}
          <h3 class="subheading">{{ page.subtitle }}</h3>
          {% endif %}
          {% if page.address %}
          <span class="meta">In {{ page.address }}</span>
          {% endif %}
          <span class="meta">Posted by {% if page.author %}{{ page.author }}{% else %}{{ site.title }}{% endif %} on {{ page.date | date: "%B %-d, %Y" }}</span>
        </div>
      </div>
    </div>
  </div>
</header>

<!-- Post Content -->
<article>
  <div class="container">
    <div class="row">

      <!-- Post Container -->
      <div class="
                col-lg-8 col-lg-offset-2
                col-md-10 col-md-offset-1
                post-container">

        {{ content }}

        <hr style="visibility: hidden;">

        <ul class="pager">
          {% if page.previous.url %}
          <li class="previous">
            <a href="{{ page.previous.url | prepend: site.baseurl | replace: '//', '/' }}" data-toggle="tooltip"
               data-placement="top" title="{{page.previous.title}}">
              Previous<br>
              <span>{{page.previous.title}}</span>
            </a>
          </li>
          {% endif %}
          {% if page.next.url %}
          <li class="next">
            <a href="{{ page.next.url | prepend: site.baseurl | replace: '//', '/' }}" data-toggle="tooltip"
               data-placement="top" title="{{page.next.title}}">
              Next<br>
              <span>{{page.next.title}}</span>
            </a>
          </li>
          {% endif %}
        </ul>


        {% if site.cloudKey %}
        <!-- 网易评论框 start -->
        <div id="cloud-tie-wrapper" class="cloud-tie-wrapper"></div>
        <script>
          var cloudTieConfig = {
            url: document.location.href,
            sourceId: "",
            productKey: "{{ site.cloudKey }}",
            target: "cloud-tie-wrapper"
          };
        </script>
        <script src="https://img1.cache.netease.com/f2e/tie/yun/sdk/loader.js"></script>
        <!-- 网易评论框 end -->
        {% endif %}

        {% if site.disqus_username %}
        <!-- disqus 评论框 start -->
        <div class="comment">
          <div id="disqus_thread" class="disqus-thread"></div>
        </div>
        <!-- disqus 评论框 end -->
        {% endif %}

      </div>

      <!-- Side Catalog Container -->
      {% if page.catalog %}
      <div class="
                col-lg-2 col-lg-offset-0
                visible-lg-block
                sidebar-container
                catalog-container">
        <div class="side-catalog">
          <hr class="hidden-sm hidden-xs">
          <h5>
            <a class="catalog-toggle" href="#">CATALOG</a>
          </h5>
          <ul class="catalog-body"></ul>
        </div>
      </div>
      {% endif %}

      <!-- Sidebar Container -->
      <div class="
                col-lg-8 col-lg-offset-2
                col-md-10 col-md-offset-1
                sidebar-container">

        <!-- Featured Tags -->
        {% if site.featured-tags %}
        <section>
          <hr class="hidden-sm hidden-xs">
          <h5><a href="/tags/">FEATURED TAGS</a></h5>
          <div class="tags">
            {% for tag in site.tags %}
            {% if tag[1].size > site.featured-condition-size %}
            <a href="/tags/#{{ tag[0] }}" title="{{ tag[0] }}" rel="{{ tag[1].size }}">
              {{ tag[0] }}
            </a>
            {% endif %}
            {% endfor %}
          </div>
        </section>
        {% endif %}

        <!-- Friends Blog -->
        {% if site.friends %}
        <hr>
        <h5>FRIENDS</h5>
        <ul class="list-inline">
          {% for friend in site.friends %}
          <li><a href="{{friend.href}}">{{friend.title}}</a></li>
          {% endfor %}
        </ul>
        {% endif %}
      </div>
    </div>
  </div>
</article>

{% if site.disqus_username %}
<!-- disqus 公共JS代码 start (一个网页只需插入一次) -->
<script type="text/javascript">
  /* * * CONFIGURATION VARIABLES * * */
  var disqus_shortname = "{{site.disqus_username}}";
  var disqus_identifier = "{{page.id}}";
  var disqus_url = "{{site.url}}{{page.url}}";

  (function () {
    var dsq = document.createElement('script');
    dsq.type = 'text/javascript';
    dsq.async = true;
    dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
</script>
<!-- disqus 公共JS代码 end -->
{% endif %}


{% if site.anchorjs %}
<!-- async load function -->
<script>
  function async(u, c) {
    var d = document, t = 'script',
        o = d.createElement(t),
        s = d.getElementsByTagName(t)[0];
    o.src = u;
    if (c) {
      o.addEventListener('load', function (e) {
        c(null, e);
      }, false);
    }
    s.parentNode.insertBefore(o, s);
  }
</script>
<!-- anchor-js, Doc:http://bryanbraun.github.io/anchorjs/ -->
<script>
  async("//cdnjs.cloudflare.com/ajax/libs/anchor-js/1.1.1/anchor.min.js", function () {
    anchors.options = {
      visible: 'always',
      placement: 'right',
      icon: '#'
    };
    anchors.add().remove('.intro-header h1').remove('.subheading').remove('.sidebar-container h5');
  })
</script>
<style>
  /* place left on bigger screen */
  @media all and (min-width: 800px) {
    .anchorjs-link {
      position: absolute;
      left: -0.75em;
      font-size: 1.1em;
      margin-top: -0.1em;
    }
  }
</style>
{% endif %}